<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登陆页面</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/for_pass.css">
    <script src="./js/jquery.min.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="nav">
        <img src="img/blog_logo.png" alt="">
        <span class="title">思维驿站--燃笔博客</span>
        <!-- 用来占据中间位置 -->
        <span class="spacer"></span>
        <a href="blog_list.html">主页</a>
        <a href="reg.html">注册</a>
        <!-- <a href="#">注销</a> -->
    </div>
    <!-- 版心 -->
    <div class="login-container">
        <!-- 中间的登陆框 -->
        <div class="login-dialog">
            <h3>找回密码</h3>
            <div class="row">
                <span>用户名</span>
                <input type="text" id="username">
                <button id="se_info" onclick="searchByName()">查询</button>
            </div>
            <div>
                <div class="row">
                    <span>密保问题</span>
                    <input type="text" class="probl" disabled placeholder="请先输入用户名" id="pro_detail">
                </div>
                <div class="row">
                    <span>密保答案</span>
                    <input type="text" id="pro_ano">
                    <button id="sub_pro" onclick="subMyAnswer()">验证</button>
                </div>
            </div>
            <div class="row">
                <span>新的密码</span>
                <input type="text" class="probl" disabled placeholder="请输入新的密码" id="new_pass">

            </div>
            <div class="row">
                <span>确认密码</span>
                <input type="text" class="probl" disabled placeholder="请先输入确认密码" id="con_pass">
            </div>
            <div class="row">
                <button id="submit" onclick="ajaxSub()">提&nbsp;&nbsp;交</button>
            </div>
            <div id="for_pass"><a href="login.html">返回登录</a></div>
        </div>
    </div>
    <script>
        function searchByName() {
            var $username = jQuery('#username')
            if ($username.val() == '') {
                alert('请先输入用户名！')
                $username.focus()
                return
            }

            jQuery.ajax({
                url: "user/for_pass_name",
                type: "post",
                data: {
                    "username": $username.val()
                },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        $username.val($username.val())
                        $username.attr('disabled', 'disabled')
                        jQuery('#pro_detail').val(result.data.confidentiality)
                        jQuery('#pro_ano').focus()
                    } else if (result != null && result.data != 200) {
                        alert(result.msg)
                    }
                }
            })
        }

        function subMyAnswer() {
            var $username = jQuery('#username')
            var $answer = jQuery('#pro_ano')
            if ($username.val() == '') {
                alert('请先输入用户名！')
                $username.focus()
                return
            }
            if ($answer.val() == '') {
                alert('请先输入答案！')
                $answer.focus()
                return
            }
            jQuery.ajax({
                url: "user/for_pass_ans",
                type: "post",
                data: {
                    "username": $username.val(),
                    "conAnswer": $answer.val()
                },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        alert('密保正确，请输入新的密码！')
                        $answer.val($answer.val())
                        $answer.attr('disabled', 'disabled')
                        jQuery('#new_pass').removeAttr('disabled')
                        jQuery('#con_pass').removeAttr('disabled')
                        jQuery('#new_pass').focus()
                    } else if (result != null && result.data != 200) {
                        alert(result.msg)
                    }
                }
            })
        }

        function ajaxSub() {
            var $newPass = jQuery('#new_pass')
            var $conPass = jQuery('#con_pass')
            var $username = jQuery('#username')
            var $answer = jQuery('#pro_ano')

            if ($username.val() == '') {
                alert('请先输入用户名！')
                $username.focus()
                return
            }
            if ($answer.val() == '') {
                alert('请先输入答案！')
                $answer.focus()
                return
            }

            if ($newPass.val() == '') {
                alert('请输入新密码！')
                $newPass.focus()
                return
            }
            if ($conPass.val() == '') {
                alert('请输入确认密码！')
                $conPass.focus()
                return
            }
            if ($newPass.val() != $conPass.val()) {
                alert('新密码和确认密码不一致！')
                $newPass.focus()
                return
            }
            jQuery.ajax({
                url: "user/for_pass_update",
                type: "post",
                data: {
                    "username": $username.val(),
                    "conAnswer": $answer.val(),
                    "password": $conPass.val()
                },
                success: function (result) {
                    if (result != null && result.code == 200 && result.data == 1) {
                        alert("修改密码成功！")
                        location.href = "login.html"
                    } else if (result != null && result.code != 200) {
                        alert(result.msg)
                    }
                }
            })
        }


    </script>
</body>

</html>